<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<%@ include file="../common/up.jsp" %>
    <div class="panel">
        <div class="panel-heading">
            <span class="panel-title">${society.society_name}协会添加成员</span>
        </div>
        <div class="panel-body">
            <form action="student/queryStudent" method="post">
                姓名：<input type="text" class="form-control" name="name" placeholder="请输入姓名"><br>
                学号：<input type="number" class="form-control" name="number" placeholder="请输入学号"><br>
                <input type="submit" class="btn btn-success" value="搜索"/>
            </form>

            <table class="table" data-assid="${requestScope.society.societyId}">

            <thead>
                    <tr>
                        <th>学号</th>
                        <th>姓名</th>
                        <th>性别</th>
                        <th>生日</th>
                        <th>毕业与否</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>

                    <c:if test="${not empty requestScope.students}">
                        <c:forEach items="${requestScope.students}" var="student">
                            <tr data-stuid="${student.studentId}">
                                <td>${student.studentNumber}</td>
                                <td>${student.studentName}</td>
                                <td>${student.gender}</td>
                                <td>
                                    <fmt:formatDate type="date" value="${student.birthday}" pattern="yyyy-MM-dd"/>
                                </td>
                                <td>
                                        ${student.graduated == 1 ? "在校" : "毕业"}
                                </td>
                                <td>
                                    <button class="btn btn-primary" onclick="addStudent(this)">招收</button>
                                </td>
                            </tr>
                        </c:forEach>
                    </c:if>
                    </tbody>
                </table>

        </div>
    </div>

    <script>
        function addStudent(ele) {
            let stuId = ele.parentNode.parentNode.dataset.stuid;
            let assId = ele.parentNode.parentNode.parentNode.parentNode.dataset.assid;

            console.log(stuId);//网页cosole输出
            console.log(assId);

            // 检查stuId和assId是否为空或者不是有效的数字字符串
            if (!stuId || isNaN(Number(stuId))) {
                alert("学生ID不能为空且必须是有效的数字");
                return;
            }
            if (!assId || isNaN(Number(assId))) {
                alert("协会ID不能为空且必须是有效的数字");
                return;
            }

            let data = {
                stuId: stuId,
                assId: assId
            };
            axios.post("/member/addMember", axios.transformRequest(data))
                .then((response) => {
                    if (response.data.status === "success") {
                        alert("添加成功");
                        ele.parentNode.parentNode.parentNode.removeChild(ele.parentNode.parentNode);
                    } else {
                        alert(response.data.message);
                    }
                }).catch((e) => {
                alert(e);
            });
        }
    </script>
<%@include file="../common/down.jsp" %>








<%--<%@ page contentType="text/html;charset=UTF-8" language="java" %>--%>

<%--<%@ include file="../common/up.jsp" %>--%>
<%--<div class="panel">--%>
<%--    <div class="panel-heading">--%>
<%--        <span class="panel-title">${society.society_name}协会添加成员</span>--%>
<%--    </div>--%>
<%--    <div class="panel-body">--%>
<%--        <form action="student/queryStudent" method="post">--%>
<%--            姓名：<input type="text" class="form-control" name="name" placeholder="请输入姓名"><br>--%>
<%--            学号：<input type="number" class="form-control" name="number" placeholder="请输入学号"><br>--%>
<%--            <input type="submit" class="btn btn-success" value="搜索"/>--%>
<%--        </form>--%>

<%--        <table class="table" id="studentTable" data-association-id="${requestScope.society.societyId}">--%>

<%--            <thead>--%>
<%--            <tr>--%>
<%--                <th>学号</th>--%>
<%--                <th>姓名</th>--%>
<%--                <th>性别</th>--%>
<%--                <th>生日</th>--%>
<%--                <th>毕业与否</th>--%>
<%--                <th>操作</th>--%>
<%--            </tr>--%>
<%--            </thead>--%>
<%--            <tbody>--%>

<%--            <c:if test="${not empty requestScope.students}">--%>
<%--                <c:forEach items="${requestScope.students}" var="student">--%>
<%--                    <tr data-student-id="${student.studentId}" class="student-row">--%>
<%--                        <td>${student.studentNumber}</td>--%>
<%--                        <td>${student.studentName}</td>--%>
<%--                        <td>${student.gender}</td>--%>
<%--                        <td>--%>
<%--                            <fmt:formatDate type="date" value="${student.birthday}" pattern="yyyy-MM-dd"/>--%>
<%--                        </td>--%>
<%--                        <td>--%>
<%--                                ${student.graduated == 1? "在校" : "毕业"}--%>
<%--                        </td>--%>
<%--                        <td>--%>
<%--                            <button class="btn btn-primary" onclick="addStudent(this)">招收</button>--%>
<%--                        </td>--%>
<%--                    </tr>--%>
<%--                </c:forEach>--%>
<%--            </c:if>--%>
<%--            </tbody>--%>
<%--        </table>--%>

<%--    </div>--%>
<%--</div>--%>



<%--<script>--%>
<%--    document.addEventListener('DOMContentLoaded', function () {--%>
<%--        // 使用事件委托绑定点击事件到表格元素--%>
<%--        document.getElementById('studentTable').addEventListener('click', function (event) {--%>
<%--            if (event.target && event.target.matches('.btn.btn-primary')) {--%>
<%--                // 通过事件委托获取点击按钮所在行的学生ID和表格的协会ID--%>
<%--                let row = event.target.closest('.student-row');--%>
<%--                let stuId = row.dataset.stuId;--%>
<%--                let assId = document.getElementById('studentTable').dataset.assId;--%>

<%--                console.log(stuId);--%>
<%--                console.log(assId);--%>

<%--                // 检查stuId和assId是否为空或者不是有效的数字字符串--%>
<%--                if (!stuId || isNaN(Number(stuId))) {--%>
<%--                    alert("学生ID不能为空且必须是有效的数字");--%>
<%--                    return;--%>
<%--                }--%>
<%--                if (!assId || isNaN(Number(assId))) {--%>
<%--                    alert("协会ID不能为空且必须是有效的数字");--%>
<%--                    return;--%>
<%--                }--%>

<%--                let data = {--%>
<%--                    stuId: stuId,--%>
<%--                    assId: assId--%>
<%--                };--%>
<%--                axios.post("/member/addMember", axios.transformRequest(data))--%>
<%--                    .then((number) => {--%>
<%--                        if (number.data == 1) {--%>
<%--                            alert("添加成功");--%>
<%--                            row.remove();--%>
<%--                        } else {--%>
<%--                            alert(number.data.message);--%>
<%--                        }--%>
<%--                    }).catch((e) => {--%>
<%--                    alert(e);--%>
<%--                });--%>
<%--            }--%>
<%--        });--%>
<%--    });--%>
<%--</script>--%>

<%--<%@include file="../common/down.jsp" %>--%>